<template>
  <div>
    <!-- <h3>当前最新的 count 值为: {{ $store.state.count }}</h3> -->
    <h3>{{ $store.getters.showNum }}</h3>
    <button @click="handlel1">+1</button>
    <br />
    <button @click="handlel2">+n</button>
    <input type="text" v-model.number="unknown" />
    <br />
    <button @click="handlel3">延时1秒 +1</button>
    <br />
    <button @click="handlel4">延时1秒 +n</button>
    <input type="text" v-model.number="unknown" />
  </div>
</template>

<script>
export default {
  name: 'Addition',
  data() {
    return {
      unknown: 2
    }
  },
  methods: {
    handlel1() {
      this.$store.commit('add')
    },
    handlel2() {
      this.$store.commit('addN', this.unknown)
    },
    handlel3() {
      this.$store.dispatch('addAsync')
    },
    handlel4() {
      this.$store.dispatch('addNAsync', this.unknown)
    }
  }
}
</script>

<style lang="less" scoped></style>
